<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
		<title>浏览记录</title>
		<link rel="shortcut icon" href="https://mat1.gtimg.com/chinanba/images/favicon.ico">
	</head>
	<style>
		* {
			margin: 0;
			padding: 0;
			list-style: none;
		}

		html {
			width: 100%;
			height: 100%;
			font-size: 100px;
		}

		body {
			font-size: 16px;
			width: 100%;
			height: 100%;
			background-color: #eeeeee;
		}

		/* header */
		.header {
			width: 100%;
			height: 0.5rem;
			background-color: #e6071b;
			color: white;
			position: relative;
		}

		.header-left {
			position: absolute;
			top: 0;
			left: 0;
		}

		.header-left img {
			width: 0.5rem;
			height: 0.5rem;
		}

		.header-center {
			text-align: center;
		}

		.header-center p {
			line-height: 0.5rem;
			font-size: 0.2rem;
		}

		.header-right {
			position: absolute;
			right: 0.15rem;
			top: 0.13rem;
		}

		/* banner */
		.banner {
			width: 100%;
			height: 100%;
			background-color: white;
		}

		.banner ul {
			position: relative;
			height: 1rem;
			padding-top: 0.2rem;
			margin-right: 0.12rem;
			border-bottom: 2px solid #eeeeee;
			margin-left: 0.12rem;
		}

		.banner .banner-left img {
			width: 0.8rem;
			height: 0.8rem;
		}
        .banner .banner-right {
        	position: absolute;
        	top: .2rem;
        	left: 1.1rem;
        }
		
		.banner .banner-right p {
			font-size: 0.14rem;
			line-height: 0.25rem;
			font-weight: bold;
		}

		.banner .banner-right small{
			color: #E6071B;
		}

		.banner .banner-right big {
			color: #E6071B;
			font-size: .2rem;
			line-height: .3rem;
		}

		.banner .banner-right span {
			color: #888888;
			font-size: 0.12rem;
			text-decoration: line-through;
		}

		.banner .banner-foot {
			border-bottom: none;
		}
	</style>
	<body>
		<!-- header -->
		<div id="header">
			<div class="header">
				<ul class="header-left">
					<img src="../img/back.png">
				</ul>
				<ul class="header-center">
					<p>浏览记录</p>
				</ul>
				<ul class="header-right">
					<span>清空</span>
				</ul>
			</div>
		</div>
		<!-- banner -->
		<div class="banner">
			<ul>
				<li class="banner-left">
					<img src="../img/1.png">
				</li>
				<li class="banner-right">
					<p>2016薄春夏季女士睡衣带胸垫性感两件套蕾丝吊带睡裙家居服</p>
					<small>￥</small>
					<big>60.00</big>
					<span>￥160.00</span>
				</li>
			</ul>
			<ul>
				<li class="banner-left">
					<img src="../img/2.png">
				</li>
				<li class="banner-right">
					<p>金喜路家纺纯棉四件套春全棉床上用品婚庆卡通被套床单4床品特价</p>
					<small>￥</small>
					<big>139.00</big>
					<span>￥278.00</span>
				</li>
			</ul>
			<ul class="banner-foot">
				<li class="banner-left">
					<img src="../img/3.png">
				</li>
				<li class="banner-right">
					<p>韩熙贞口红持久保湿不脱色不掉色防水咬唇妆正品居有滋润补水唇彩</p>
					<small>￥</small>
					<big>39.00</big>
					<span>￥88.00</span>
				</li>
			</ul>
		</div>
	</body>
</html>
